<template>
  <div class="main-container" v-loading="loading">
    <div class="card-container box-container box">
      <div class="zzjg-left">
        <div class="tab-box zzjg-tab-box" style="position: relative">
          <Tree-Select
            class="zoomResize"
            :data="dwList"
            :defaultProps="defaultProps"
            style="
            width: 100%;
            display: inline-block;
            margin-right: 10px;
            margin-bottom: 10px;
            position: relative;
          "
            :expand-on-click-node="false"
            node-key="dwbm"
            ref="treeselected"
            v-model="dwbm"
            :default-expanded-keys="expandKeys"
            placeholder
            :clearable="false"
            @change="changeTree"
          ></Tree-Select>
          <a-input-search style="margin-bottom: 8px" @change="filterTree" allow-clear />
          <a-tree
            v-if="zzjgml.length"
            :expandedKeys="defaultExpandedKeys"
            @expand="expand"
            blockNode
            :tree-data="zzjgml"
            :selectedKeys="selectTreeNode"
            :replace-fields="replaceFields"
            @select="treeSelect"
            show-icon
          >
            <IconFont type="swx-icon-danweiicon" slot="1" />
            <IconFont type="swx-icon-danweierji" slot="2" />
            <IconFont type="swx-icon-zhiwu" slot="3" />
            <IconFont type="swx-icon-jiaose" slot="4" />
          </a-tree>

          <!-- 回收站 -->
          <a-popover v-model="recycleVisible" trigger="click" title="回收站" @click="clickPopover">
            <template slot="content">
              <div class="card-container popover">
                <a-tabs hide-add type="editable-card">
                  <a-tab-pane key="2" tab="人员管理">
                    <div style="position: relative; border: 1px solid #dcdcdc">
                      <div class="popover-input">
                        <span style="margin-right: 4px">姓名:</span>
                        <a-input style="margin-right: 10px" v-model="mc" />
                        <span style="margin-right: 4px">工作证号:</span>
                        <a-input v-model="gzzh" />
                      </div>
                      <div style="position: absolute; right: 0; top: 14px">
                        <div class="btn-group-item" style="margin-right: 6px" @click="onSearchRy">
                          <IconFont type="swx-icon-sousuo1" />查询
                        </div>
                        <div
                          class="btn-group-item"
                          style="margin-right: 6px"
                          @click="recycleHuifuRy"
                        >
                          <IconFont type="swx-icon-tianjia" />恢复
                        </div>
                        <div
                          class="btn-group-item"
                          style="margin-right: 6px"
                          @click="recycleShanChuBtn"
                        >
                          <IconFont type="swx-icon-shanchu" />删除
                        </div>
                      </div>
                    </div>

                    <!-- 回收站人员table -->
                    <a-table
                      style="margin-top: 4px"
                      :columns="huishouzhanRyColumns"
                      class="sxlb"
                      :data-source="huishouzhanRyLists"
                      :row-selection="{
                      selectedRowKeys: rYSelectedRowKeys,
                      onChange: rYOnSelectChange
                    }"
                      :pagination="false"
                    ></a-table>
                  </a-tab-pane>
                </a-tabs>
              </div>
            </template>

            <div
              class="btn-group-item btn-group-delete-item single-btn"
              style="position: absolute; right: 10px; bottom: -30px"
            >
              <IconFont type="swx-icon-huishouzhan" />回收站
            </div>
          </a-popover>
        </div>
      </div>

      <div class="right" v-if="level != 4">
        <div class="top" style="position: relative">
          <div class="card-container">
            <a-tabs hide-add type="editable-card">
              <a-tab-pane key="1" :tab="tabTitle">
                <div style="text-align: right; margin-bottom: 10px">
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="dwClickAddBm"
                    v-show="level == 1 || level == ''"
                  >
                    <IconFont type="swx-icon-tianjia" />添加部门
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="addRole"
                    v-show="level == 2"
                  >
                    <IconFont type="swx-icon-tianjia" />添加角色
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="bmClickAddZbm"
                    v-show="level == 2"
                  >
                    <IconFont type="swx-icon-tianjia" />添加子部门
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="showCopyRole = true"
                    v-show="level == 2"
                  >
                    <IconFont type="swx-icon-fuzhi" />复制角色
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="changeBmInfo"
                    v-show="level == 2"
                  >
                    <IconFont type="swx-icon-bianjiiconkaobei14" />修改
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="deletDepartmentBtn"
                    v-show="level == 2"
                  >
                    <IconFont type="swx-icon-shanchu" />删除
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    v-show="level == 3"
                    @click="toGoYhsq"
                  >
                    <IconFont type="swx-icon-pingchashouquan" />授权
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="changeRole"
                    v-show="level == 3"
                  >
                    <IconFont type="swx-icon-bianjiiconkaobei14" />修改角色
                  </div>
                  <div
                    class="btn-group-item"
                    style="margin-right: 6px"
                    @click="deletRole"
                    v-show="level == 3"
                  >
                    <IconFont type="swx-icon-shanchu" />删除角色
                  </div>
                  <div
                    class="btn-group-item"
                    v-show="level == 1 || level == ''"
                    @click="tbbmsjDia = true"
                  >
                    <IconFont type="swx-icon-tongbushuju" />同步部门数据
                  </div>
                </div>
                <div>
                  <table style="table-layout: fixed" class="zzjgTable">
                    <tr v-show="level == 1 || level == ''">
                      <td>单位名称</td>
                      <td>{{ personInfo.dwmc }}</td>
                      <td>单位编码</td>
                      <td>{{ dwInfoMesseage.dwbm }}</td>
                    </tr>
                    <tr v-show="level == 1 || level == ''">
                      <td>单位简称</td>
                      <td>{{ dwInfoMesseage.dwjc }}</td>
                      <td>单位属性</td>
                      <td>{{ dwInfoMesseage.dwsx }}</td>
                    </tr>
                    <tr v-show="level == 1 || level == ''">
                      <td>单位级别</td>
                      <td>{{ dwInfoMesseage.dwjb }}</td>
                    </tr>

                    <tr v-show="level == 2">
                      <td>单位名称</td>
                      <td>{{ personInfo.dwmc }}</td>
                      <td>部门名称</td>
                      <td>{{ bmInfoMesseage.bmmc }}</td>
                    </tr>
                    <tr v-show="level == 2">
                      <td>部门简称</td>
                      <td>{{ bmInfoMesseage.bmjc }}</td>
                      <td>是否临时部门</td>
                      <td>{{ bmInfoMesseage.sflsbmmc }}</td>
                    </tr>
                    <tr v-show="level == 2">
                      <td>部门序号</td>
                      <td>{{ bmInfoMesseage.bmxh }}</td>
                    </tr>

                    <tr v-show="level == 3">
                      <td>部门名称</td>
                      <td>{{ roleInfoMesseage.bmmc }}</td>
                      <td>角色名称</td>
                      <td>{{ roleInfoMesseage.jsmc }}</td>
                    </tr>
                    <tr v-show="level == 3">
                      <td>审批显示名称</td>
                      <td>{{ roleInfoMesseage.spxsmc }}</td>
                      <td>默认审批级别</td>
                      <td>{{ roleInfoMesseage.spjbmc }}</td>
                    </tr>
                    <tr v-show="level == 3">
                      <td>默认直接领导</td>
                      <td>{{ roleInfoMesseage.zjldmc }}</td>
                      <td>角色序号</td>
                      <td>{{ roleInfoMesseage.jsxh }}</td>
                    </tr>
                  </table>
                </div>
              </a-tab-pane>
            </a-tabs>
          </div>
        </div>
        <div class="bottom">
          <div class="card-container">
            <a-tabs hide-add type="editable-card">
              <a-tab-pane key="1" tab="人员信息">
                <div style="height: 45px">
                  <div style="float: left">
                    <a-input-search
                      placeholder="输入关键字查询"
                      style="width: 300px"
                      allow-clear
                      v-model="tableSearch"
                      @search="onSearch"
                    />
                  </div>
                  <div class="btn-group" style="float: right">
                    <div class="btn-group-item" style="margin-right: 6px" @click="setLoginOpen()">
                      <IconFont type="swx-icon-shezhi" />设置登录
                    </div>
                    <div class="btn-group-item" style="margin-right: 6px" @click="addDia">
                      <IconFont type="swx-icon-tianjia" />添加
                    </div>
                    <div class="btn-group-item" style="margin-right: 6px" @click="stopWork">
                      <IconFont type="swx-icon-tingzhi" />停职
                    </div>
                    <div class="btn-group-item btn-group-delete-item" @click="deleteIntoRecycleBtn">
                      <IconFont type="swx-icon-shanchu" />删除
                    </div>
                  </div>
                </div>

                <!-- 主页面table列表 -->
                <div style="height: calc(100% - 28px)">
                  <a-table
                    :columns="
                    nodeMessege.level == 1
                      ? personMessegeColumns
                      : personMessegeColumns1
                  "
                    class="sxlb"
                    :data-source="personMessegeData"
                    :row-selection="{
                    selectedRowKeys: selectedRowKeys,
                    onChange: onSelectChange
                  }"
                    :pagination="pagination"
                  >
                    <template slot="action" slot-scope="text, record">
                      <a
                        slot="action"
                        href="javascript:;"
                        @click="onEdit(record)"
                        style="margin-right: 4px"
                      >
                        <span class="empty-btn">
                          <IconFont type="swx-icon-bianjiiconkaobei14" />修改
                        </span>
                      </a>
                      <!--  v-if="text.dlsbcs>=5" -->
                      <a
                        slot="action"
                        href="javascript:;"
                        @click="jieShuo(record)"
                        style="margin-right: 4px"
                        v-if="text.dlsbcs >= 5"
                      >
                        <span class="empty-btn">
                          <IconFont type="swx-icon-xingzhuang887" />解锁
                        </span>
                      </a>

                      <a
                        slot="action"
                        href="javascript:;"
                        @click="recovery(record)"
                        v-if="text.zzzt == '停岗'"
                      >
                        <span class="empty-btn">
                          <IconFont type="swx-icon-tianjia" />复职
                        </span>
                      </a>
                      <a slot="action" href="javascript:;" @click="emptyPwd(record)">
                        <span class="empty-btn">
                          <IconFont type="swx-icon-qingkong" />清空密码
                        </span>
                      </a>

                      <a
                        slot="action"
                        href="javascript:;"
                        @click="reset(record)"
                        v-if="personInfo.sjly == '2'"
                      >
                        <span class="empty-btn">
                          <IconFont type="swx-icon-shezhi" />重置密码
                        </span>
                      </a>

                      <a
                        slot="action"
                        href="javascript:;"
                        @click="yiChuRole(record)"
                        v-if="nodeMessege.level == '3'"
                      >
                        <span class="empty-btn">
                          <IconFont type="swx-icon-shanchu" />移除角色
                        </span>
                      </a>
                    </template>
                  </a-table>
                </div>
              </a-tab-pane>
            </a-tabs>
          </div>
        </div>
      </div>

      <!-- 个人信息 -->
      <div class="personalInformation" v-if="level == 4">
        <div class="header">
          <div class="btn-group" style="float: right; margin-top: 5px">
            <div class="btn-group-item" style="margin-right: 6px" @click="changePersonBtn">
              <IconFont type="swx-icon-bianjiiconkaobei14" />修改
            </div>
            <div class="btn-group-item" style="margin-right: 6px" @click="toGoYhsq">
              <IconFont type="swx-icon-pingchashouquan" />授权
            </div>
            <div
              class="btn-group-item"
              style="margin-right: 6px"
              @click="jieShuo2"
              v-if="personalInformation.sd"
            >
              <IconFont type="swx-icon-xingzhuang887" />解锁
            </div>
            <div
              class="btn-group-item"
              style="margin-right: 6px"
              @click="tingzhiPersonBtn"
              v-if="personalInformation.zzzt == '在职'"
            >
              <IconFont type="swx-icon-tingzhi" />停职
            </div>
            <div
              class="btn-group-item"
              style="margin-right: 6px"
              @click="fuzhiPersonBtn"
              v-if="personalInformation.zzzt == '停岗'"
            >
              <IconFont type="swx-icon-tingzhi" />复职
            </div>
            <div class="btn-group-item" style="margin-right: 6px" @click="qingKongMm">
              <IconFont type="swx-icon-qingkong" />清空密码
            </div>
            <div
              class="btn-group-item btn-group-delete-item"
              style="margin-right: 6px"
              @click="shanChuPeronBtn"
            >
              <IconFont type="swx-icon-shanchu" />删除
            </div>
          </div>
        </div>
        <div class="mainBody">
          <div style="padding-left: 10px" class="grxsClass">个人信息</div>
          <div style="margin-top: 10px">
            <table style="table-layout: fixed" class="riginalTable">
              <tr>
                <td>姓名</td>
                <td>{{ personalInformation.mc }}</td>
                <td>登录名</td>
                <td>{{ personalInformation.dlbm }}</td>
              </tr>
              <tr>
                <td>性别</td>
                <td>{{ personalInformation.xb == 0 ? '女' : '男' }}</td>
                <td>登录方式</td>
                <td>{{ personalInformation.dlfs }}</td>
              </tr>
              <tr>
                <td>身份证号</td>
                <td>{{ personalInformation.sfzh }}</td>
                <td>电子邮件</td>
                <td>{{ personalInformation.dzyj }}</td>
              </tr>
              <tr>
                <td>手机(用于接收信息)</td>
                <td>{{ personalInformation.dhhm }}</td>
                <td>电话</td>
                <td>{{ personalInformation.dlbm }}</td>
              </tr>
              <tr>
                <td>人员类型</td>
                <td>{{ personalInformation.rylx_mc }}</td>
                <td>序号</td>
                <td>{{ personalInformation.xh }}</td>
              </tr>
              <tr>
                <td>CA标识</td>
                <td>{{ personalInformation.caid }}</td>
                <td>状态</td>
                <td>{{ personalInformation.zzzt }}</td>
              </tr>
            </table>
          </div>
          <!-- <div style="border-left:5px solid #4080f0;padding-left:10px;margin-top:10px">角色信息</div> -->
        </div>
      </div>

      <!-- 添加部门 -->
      <a-modal
        v-model="showDepartment"
        :title="bmTitle"
        @ok="addDepartmentBtn"
        class="zzjg-dialog"
        centered
        style="width: 900px"
      >
        <table class="riginalTable" style="table-layout: fixed">
          <tr>
            <td style="width: 16%">
              <span class="red">*</span>
              <span>部门名称</span>
            </td>
            <td>
              <input v-model="addForm.bmmc" class="riginalInput" />
              <span
                style="float: left; color: red; padding-left: 4px"
                v-if="addForm.bmmc.length <= 0"
              >不能为空</span>
            </td>
            <td style="width: 16%">
              <!-- <span class="red">*</span> -->
              <span>部门简称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addForm.bmjc" />
            </td>
          </tr>
          <tr>
            <td>
              <span>部门文号名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addForm.bmwhjc" />
            </td>
            <td>
              <span>部门案号简称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addForm.bmahjc" />
            </td>
          </tr>
          <tr>
            <td>
              <span class="red">*</span>
              <span>部门序号</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addForm.bmxh" />
            </td>
            <td>
              <span>父部门</span>
            </td>
            <td style="width: 100%; padding-right: 0">
              <a-tree-select
                dropdownMatchSelectWidth
                v-model="addForm.fbmbm"
                show-search
                treeNodeFilterProp="title"
                style="width: 100%"
                :dropdown-style="{
                maxHeight: '300px',
                overflow: 'auto',
                'overflow-x': 'hiddden'
              }"
                allow-clear
                tree-default-expand-all
              >
                <a-tree-select-node
                  v-for="(item, index) in bmSelectList"
                  :key="item.bm"
                  :title="item.mc"
                  :value="item.bm"
                  disabled
                >
                  <a-tree-select-node
                    v-for="(el, i) in item.children"
                    :key="el.bm"
                    :title="el.mc"
                    :value="el.bm"
                    :disabled="el.bm == nodeMessege.bm"
                  >
                    <a-tree-select-node
                      v-for="(ele, i1) in el.children"
                      :key="ele.bm"
                      :title="ele.mc"
                      :value="ele.bm"
                      :disabled="ele.bm == nodeMessege.bm"
                    ></a-tree-select-node>
                  </a-tree-select-node>
                </a-tree-select-node>
              </a-tree-select>
            </td>
          </tr>
          <tr>
            <td>是否临时部门</td>
            <td>
              <a-radio-group v-model="addForm.sflsbm">
                <a-radio value="Y">是</a-radio>
                <a-radio value="N">否</a-radio>
              </a-radio-group>
            </td>
            <td>
              <!-- <span class="red">*</span> -->
              部门类别
            </td>
            <td style="width: 100%; padding-right: 0">
              <a-select v-model="addForm.bmlbList" style="width: 100%" mode="multiple">
                <a-select-option
                  :value="item.dm"
                  v-for="(item, i) in bmlbListsApi"
                  :key="i"
                >{{ item.mc }}</a-select-option>
              </a-select>
            </td>
          </tr>
          <tr>
            <td>备注</td>
            <td>
              <input class="riginalInput" v-model="addForm.bz" />
            </td>
            <td></td>
            <td></td>
          </tr>
        </table>
      </a-modal>

      <!-- 添加角色 -->
      <a-modal v-model="showBmRole" title="添加角色" @ok="addBmRoleBtn" class="zzjg-dialog" centered>
        <table class="riginalTable" style="table-layout: fixed">
          <tr>
            <td>
              <span>单位名称</span>
            </td>
            <td>
              <input
                v-model="personInfo.dwmc"
                class="riginalInput"
                disabled
                style="cursor: not-allowed; width: 100%"
              />
            </td>
            <td>
              <span class="red">*</span>
              <span>部门名称</span>
            </td>
            <td>
              <input
                class="riginalInput"
                v-model="bmRoleForm.bmmc"
                disabled
                style="cursor: not-allowed; width: 100%"
              />
            </td>
          </tr>
          <tr>
            <td>
              <span class="red">*</span>
              <span>角色名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="bmRoleForm.jsmc" />
              <span
                style="float: left; color: red; padding-left: 4px"
                v-if="bmRoleForm.jsmc.length <= 0"
              >不能为空</span>
            </td>
            <td>
              <span>审批级别</span>
            </td>
            <td>
              <a-select v-model="bmRoleForm.spjbbm" style="width: 100%">
                <a-select-option
                  :value="item.spjbbm"
                  v-for="(item, i) in spxsmcLists"
                  :key="i"
                >{{ item.spjbmc }}</a-select-option>
              </a-select>
            </td>
          </tr>
          <tr>
            <td>
              <!-- <span class="red">*</span> -->
              <span>角色序号</span>
            </td>
            <td>
              <input class="riginalInput" v-model="bmRoleForm.jsxh" />
            </td>
            <td>
              <span>审批显示名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="bmRoleForm.spxsmc" />
            </td>
          </tr>
          <tr>
            <td>
              <span>默认直接领导</span>
            </td>
            <td style="width: 100%; padding-right: 0">
              <a-tree-select
                :treeDefaultExpandedKeys="treeExpandedKeys"
                dropdownMatchSelectWidth
                v-model="bmRoleForm.zjldbm"
                treeNodeFilterProp="title"
                show-search
                style="width: 100%"
                :dropdown-style="{ maxHeight: '300px', overflow: 'auto' }"
                allow-clear
              >
                <a-tree-select-node
                  v-for="item in mrzjldml"
                  :key="item.id"
                  :title="item.mc"
                  :value="item.id"
                  :disabled="item.level != 4"
                >
                  <a-tree-select-node
                    v-for="el in item.children"
                    :key="el.id"
                    :title="el.mc"
                    :value="el.id"
                    :disabled="el.level != 4"
                  >
                    <a-tree-select-node
                      v-for="ele in el.children"
                      :key="ele.id"
                      :title="ele.mc"
                      :value="ele.id"
                      :disabled="ele.level != 4"
                    >
                      <a-tree-select-node
                        v-for="ele1 in ele.children"
                        :key="ele1.id"
                        :title="ele1.mc"
                        :value="ele1.id"
                        :disabled="ele1.level != 4"
                      ></a-tree-select-node>
                    </a-tree-select-node>
                  </a-tree-select-node>
                </a-tree-select-node>
              </a-tree-select>
            </td>
          </tr>
        </table>
      </a-modal>

      <!-- 修改角色 -->
      <a-modal
        v-model="showChangeRole"
        title="修改角色"
        @ok="changeRoleInfoBtn"
        class="zzjg-dialog"
        centered
      >
        <table class="riginalTable" style="table-layout: fixed">
          <tr>
            <td>
              <span>单位名称</span>
            </td>
            <td>
              <input
                v-model="personInfo.dwmc"
                class="riginalInput"
                disabled
                style="cursor: not-allowed; width: 100%"
              />
            </td>
            <td>
              <span class="red">*</span>
              <span>部门名称</span>
            </td>
            <td>
              <input
                class="riginalInput"
                v-model="changeRoleForm.bmmc"
                disabled
                style="cursor: not-allowed; width: 100%"
              />
            </td>
          </tr>
          <tr>
            <td>
              <span class="red">*</span>
              <span>角色名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="changeRoleForm.jsmc" />
              <span
                style="float: left; color: red; padding-left: 4px"
                v-if="changeRoleForm.jsmc.length <= 0"
              >不能为空</span>
            </td>
            <td>
              <span>审批级别</span>
            </td>
            <td>
              <a-select v-model="changeRoleForm.spjbbm" style="width: 100%">
                <a-select-option
                  :value="item.spjbbm"
                  v-for="(item, i) in spxsmcLists"
                  :key="i"
                >{{ item.spjbmc }}</a-select-option>
              </a-select>
            </td>
          </tr>
          <tr>
            <td>
              <!-- <span class="red">*</span> -->
              <span>角色序号</span>
            </td>
            <td>
              <input class="riginalInput" v-model="changeRoleForm.jsxh" />
            </td>
            <td>
              <span>默认直接领导</span>
            </td>
            <td style="width: 100%; padding-right: 0">
              <a-tree-select
                :treeDefaultExpandedKeys="treeExpandedKeys"
                dropdownMatchSelectWidth
                v-model="changeRoleForm.zjldbm"
                treeNodeFilterProp="title"
                show-search
                style="width: 100%"
                :dropdown-style="{ maxHeight: '300px', overflow: 'auto' }"
                allow-clear
              >
                <a-tree-select-node
                  v-for="item in mrzjldml"
                  :key="item.id"
                  :title="item.mc"
                  :value="item.id"
                  :disabled="item.level != 4"
                >
                  <a-tree-select-node
                    v-for="el in item.children"
                    :key="el.id"
                    :title="el.mc"
                    :value="el.id"
                    :disabled="el.level != 4"
                  >
                    <a-tree-select-node
                      v-for="ele in el.children"
                      :key="ele.id"
                      :title="ele.mc"
                      :value="ele.id"
                      :disabled="ele.level != 4"
                    >
                      <a-tree-select-node
                        v-for="ele1 in ele.children"
                        :key="ele1.id"
                        :title="ele1.mc"
                        :value="ele1.id"
                        :disabled="ele1.level != 4"
                      ></a-tree-select-node>
                    </a-tree-select-node>
                  </a-tree-select-node>
                </a-tree-select-node>
              </a-tree-select>
            </td>
          </tr>
          <tr>
            <td>
              <span>审批显示名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="changeRoleForm.spxsmc" />
            </td>
          </tr>
        </table>
      </a-modal>

      <!-- 设置登录方式 -->
      <a-modal
        v-model="showSetLoginMode"
        title="设置登录方式"
        @ok="setLoginBtn"
        class="zzjg-dialog-mini"
        centered
      >
        <table class="riginalTable" style="table-layout: fixed">
          <tr>
            <td style="width: 18%">设置范围</td>
            <td>
              <a-radio-group v-model="setLoginForm.range">
                <a-radio value="1">当前选中列表</a-radio>
                <a-radio value="2">
                  <span v-if="nodeMessege && level == 1">当前单位({{ nodeMessege && nodeMessege.mc }})</span>
                  <span v-if="nodeMessege && level == 2">当前部门({{ nodeMessege && nodeMessege.mc }})</span>
                  <span v-if="nodeMessege && level == 3">当前角色({{ nodeMessege && nodeMessege.mc }})</span>
                </a-radio>
              </a-radio-group>
            </td>
          </tr>
          <tr>
            <td>登录方式</td>
            <td style="padding-right: 0">
              <a-select v-model="setLoginForm.region" placeholder="please select your zone">
                <a-select-option value="账号密码，CA Key">账号密码，CA Key</a-select-option>
                <a-select-option value="账号密码">账号密码</a-select-option>
                <a-select-option value=" CA Key">CA Key</a-select-option>
              </a-select>
            </td>
          </tr>
        </table>
      </a-modal>

      <!-- 抽屉 -->
      <a-drawer title="添加人员" placement="right" :visible="showDrawerFlag" @close="onClose">
        <div class="card-container">
          <a-tabs hide-add type="editable-card">
            <a-tab-pane key="1" tab="人员信息">
              <div style="padding: 10px">
                <table class="riginalTable" style="table-layout: fixed">
                  <tr>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>姓名</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="addPersonForm.mc" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="addPersonForm.mc.length <= 0"
                      >不能为空</span>
                    </td>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>登录名</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="addPersonForm.dlbm" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="addPersonForm.dlbm.length <= 0"
                      >不能为空</span>
                    </td>
                  </tr>
                  <tr>
                    <td>性别</td>
                    <td>
                      <a-radio-group v-model="addPersonForm.xb">
                        <a-radio value="0">女</a-radio>
                        <a-radio value="1">男</a-radio>
                      </a-radio-group>
                    </td>
                    <td>
                      <span>CA标识</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="addPersonForm.caid" />
                    </td>
                  </tr>
                  <tr>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>身份证号</span>
                    </td>
                    <td>
                      <InputDiy v-model="addPersonForm.sfzh" />
                      <!-- <input class="riginalInput" v-model="addPersonForm.sfzh" @input='sfzhTjInput()' />
                        <span style="float:left;color:red;padding-left:4px;display:inline-block" v-if='addPersonForm.sfzh.length<=0'>不能为空</span>
                        <span>
                          <span class="zzjg_size12">{{addPersonForm.sfzh.length}}</span>
                          <span class="zzjg_size12">/18</span>
                      </span>-->
                    </td>
                    <td>
                      <span>电子邮件</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <input class="riginalInput" v-model="addPersonForm.dzyj" />
                    </td>
                  </tr>

                  <!-- 手机用于接收信息 -->
                  <tr>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>手机(用于接收信息)</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="addPersonForm.dhhm" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="addPersonForm.dhhm.length <= 0"
                      >不能为空</span>
                    </td>
                    <td>
                      <span>是否临时人员</span>
                      <span class="red">*</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-radio-group v-model="addPersonForm.sflsry">
                        <a-radio value="Y">是</a-radio>
                        <a-radio value="N">否</a-radio>
                      </a-radio-group>
                    </td>
                  </tr>

                  <!-- 人员类型 -->
                  <tr>
                    <td>
                      <!-- <span class="red">*（必填）</span> -->
                      <span>人员类型</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-select
                        v-model="addPersonForm.rylx_bm"
                        style="width: 100%; padding-right: 0"
                      >
                        <a-select-option
                          :value="item.dm"
                          v-for="item in rylxLists"
                          :key="item.dm"
                        >{{ item.mc }}</a-select-option>
                      </a-select>
                    </td>
                    <td>
                      <span class="red">*</span>
                      <span>序号</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <input class="riginalInput" v-model="addPersonForm.xh" />
                    </td>
                  </tr>

                  <!-- CA标识 -->
                  <tr>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>登录方式</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-select v-model="addPersonForm.dlfs" style="width: 100%; padding-right: 0">
                        <a-select-option value="账号密码、CA Key">账号密码、CA Key</a-select-option>
                        <a-select-option value="帐号密码">账号密码</a-select-option>
                        <a-select-option value="CA Key">CA Key</a-select-option>
                      </a-select>
                    </td>
                    <td>
                      <span class="red">*（必填）</span>
                      <span>身份</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-tree-select
                        dropdownMatchSelectWidth
                        v-model="addPersonForm.jcrysf_dm"
                        treeNodeFilterProp="title"
                        show-search
                        style="width: 100%"
                        :dropdown-style="{ maxHeight: '300px', overflow: 'auto' }"
                        allow-clear
                      >
                        <a-tree-select-node
                          v-for="item in shengFenml"
                          :key="item.dm"
                          :title="item.mc"
                          :value="item.dm"
                        >
                          <a-tree-select-node
                            v-for="el in item.children"
                            :key="el.dm"
                            :title="el.mc"
                            :value="el.dm"
                          >
                            <a-tree-select-node
                              v-for="ele in el.children"
                              :key="ele.dm"
                              :title="ele.mc"
                              :value="ele.dm"
                            >
                              <a-tree-select-node
                                v-for="ele1 in ele.children"
                                :key="ele1.dm"
                                :title="ele1.mc"
                                :value="ele1.dm"
                              ></a-tree-select-node>
                            </a-tree-select-node>
                          </a-tree-select-node>
                        </a-tree-select-node>
                      </a-tree-select>
                    </td>
                  </tr>
                </table>
              </div>
              <div style="text-align: right">
                <a-button type="primary" style="margin-right: 6px" @click="addPersonSubmit">确定</a-button>
              </div>
            </a-tab-pane>
            <a-tab-pane key="2" tab="角色信息">
              <RoleInfo :record="record" />
              <div style="text-align: right">
                <a-button
                  type="primary"
                  style="margin-right: 6px; margin-top: 10px"
                  @click="addPersonSubmit"
                >确定</a-button>
              </div>
            </a-tab-pane>
          </a-tabs>
        </div>
      </a-drawer>

      <!-- 添加人员 -->
      <a-modal
        v-model="showPerson"
        title="添加人员"
        class="zzjg-dialog-large addPerson"
        @cancel="closeAddRy"
        centered
        :footer="null"
      >
        <div style="position: relative; width: 100%">
          <a-input-search
            style="margin-bottom: 10px; width: 300px"
            @search="onSearch2"
            v-model="addDiaKeyWorld"
          />
          <div
            class="btn-group-item single-btn"
            style="position: absolute; right: 10px; top: 6px"
            @click="showDrawer"
          >
            <IconFont type="swx-icon-tianjia" />添加人员
          </div>
          <!-- <div v-if="nodeMessege.level==3 " class="btn-group-item single-btn" style="position:absolute;right:114px;top:6px;" @click="plAddRole">
          <IconFont type="swx-icon-tianjia" />
          批量添加角色
          </div>-->
        </div>
        <div>
          <!-- <a-table :columns="nodeMessege.level==3?personMessegeColumns:personMessegeColumns2" :data-source="addTableData" :pagination="pagination2"
          :row-selection="rowSelection2">-->
          <a-table
            :columns="personMessegeColumns2"
            :data-source="addTableData"
            :pagination="pagination2"
          >
            <template slot="action" slot-scope="text, record">
              <a
                slot="action"
                href="javascript:;"
                @click="addRoleDia(record)"
                style="margin-right: 4px"
              >
                <span class="empty-btn" v-show="nodeMessege.level == 3">
                  <IconFont type="swx-icon-tianjia" />添加
                </span>
              </a>
            </template>
          </a-table>
        </div>
      </a-modal>

      <!-- 添加子部门 -->
      <a-modal
        v-model="showChildDeparment"
        title="添加子部门"
        @ok="addChildDepartmentBtn"
        class="zzjg-dialog"
        centered
      >
        <table class="riginalTable" style="table-layout: fixed">
          <tr>
            <td>
              <span class="red">*</span>
              <span>部门名称</span>
            </td>
            <td>
              <input v-model="addChildForm.bmmc" class="riginalInput" />
              <span
                style="float: left; color: red; padding-left: 4px"
                v-if="addChildForm.bmmc.length <= 0"
              >不能为空</span>
            </td>
            <td>
              <span class="red">*</span>
              <span>部门简称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addChildForm.bmjc" />
            </td>
          </tr>
          <tr>
            <td>
              <span>部门文号名称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addChildForm.bmwhjc" />
            </td>
            <td>
              <span>部门案号简称</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addChildForm.bmahjc" />
            </td>
          </tr>
          <tr>
            <td>
              <span class="red">*</span>
              <span>部门序号</span>
            </td>
            <td>
              <input class="riginalInput" v-model="addChildForm.bmxh" />
            </td>
            <td>
              <span>父部门</span>
            </td>
            <td>
              <input
                class="riginalInput"
                v-model="addChildFormFbmbm"
                disabled
                style="cursor: not-allowed; width: 100%"
              />
            </td>
          </tr>
          <!-- radio  select-->
          <tr>
            <td>是否临时部门</td>
            <td>
              <a-radio-group v-model="addChildForm.sflsbm">
                <a-radio value="Y">是</a-radio>
                <a-radio value="N">否</a-radio>
              </a-radio-group>
            </td>
            <td>
              <span class="red">*</span>
              部门类别
            </td>
            <td style="width: 100%; padding-right: 0">
              <a-select v-model="addChildForm.bmlbList" style="width: 100%" mode="multiple">
                <a-select-option
                  :value="item.dm"
                  v-for="(item, i) in bmlbListsApi"
                  :key="i"
                >{{ item.mc }}</a-select-option>
              </a-select>
            </td>
          </tr>
          <tr>
            <td>备注</td>
            <td>
              <input class="riginalInput" v-model="addChildForm.bz" />
            </td>
            <td></td>
            <td></td>
          </tr>
        </table>
      </a-modal>

      <!-- 复制角色 -->
      <a-modal v-model="showCopyRole" title="复制角色" @ok="copyRole" class="fzjs" centered>
        <a-input-search style="margin-bottom: 8px" @change="filterTree1" />
        <a-tree
          checkable
          checkStrictly
          blockNode
          defaultExpandAll
          :tree-data="copyRoleLists"
          @check="copyRoleSelects"
          :replace-fields="replaceFields"
        ></a-tree>
      </a-modal>

      <!-- 修改人员 -->
      <a-modal
        v-model="modifyDialog"
        title="修改人员"
        @ok="modifySureBtn"
        class="zzjg-dialog-large addPerson"
        centered
        @cancel="changeDiaClose"
      >
        <div class="card-container">
          <a-tabs hide-add type="editable-card" v-model="modifyActiveKey">
            <a-tab-pane key="1" tab="人员信息">
              <div
                style="
                height: 40px;
                display: flex;
                align-items: center;
                padding-left: 10px;
              "
              >
                <div class="xgryGrxs">个人信息</div>
              </div>
              <div style="padding: 10px">
                <table class="riginalTable" style="table-layout: fixed">
                  <tr>
                    <td style="width: 18%">
                      <span class="red">*</span>
                      <span>姓名</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="modifyPersonForm.mc" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="
                        modifyPersonForm.mc && modifyPersonForm.mc.length <= 0
                      "
                      >不能为空</span>
                    </td>
                    <td style="width: 18%">
                      <span class="red">*</span>
                      <span>登录名</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="modifyPersonForm.dlbm" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="
                        modifyPersonForm.dlbm &&
                        modifyPersonForm.dlbm.length <= 0
                      "
                      >不能为空</span>
                    </td>
                  </tr>

                  <tr>
                    <td>性别</td>
                    <td>
                      <a-radio-group v-model="modifyPersonForm.xb">
                        <a-radio value="0">女</a-radio>
                        <a-radio value="1">男</a-radio>
                      </a-radio-group>
                    </td>
                    <td>
                      <span>CA标识</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="modifyPersonForm.caid" />
                    </td>
                  </tr>

                  <tr>
                    <td>
                      <span class="red">*</span>
                      <span>身份证号</span>
                    </td>
                    <td>
                      <InputDiy v-model="modifyPersonForm.sfzh" />
                      <!-- <input class="riginalInput" style="width:88%" v-model="modifyPersonForm.sfzh" @input='sfzhXgInput' />
                    <span style="float:left;color:red;padding-left:4px" v-if='modifyPersonForm.sfzh&&modifyPersonForm.sfzh.length<=0'>不能为空</span>
                    <span>
                      <span class="zzjg_size12">{{modifyPersonForm.sfzh.length}}</span>
                      <span class="zzjg_size12">/18</span>
                      </span>-->
                    </td>
                    <td>
                      <span>电子邮件</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <input class="riginalInput" v-model="modifyPersonForm.dzyj" />
                    </td>
                  </tr>

                  <!-- 手机用于接收信息 -->
                  <tr>
                    <td>
                      <span class="red">*</span>
                      <span>手机(用于接收信息)</span>
                    </td>
                    <td>
                      <input class="riginalInput" v-model="modifyPersonForm.dhhm" />
                      <span
                        style="float: left; color: red; padding-left: 4px"
                        v-if="
                        modifyPersonForm.dhhm &&
                        modifyPersonForm.dhhm.length <= 0
                      "
                      >不能为空</span>
                    </td>
                    <td>
                      <span>办公电话</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <input class="riginalInput" />
                    </td>
                  </tr>

                  <!-- 人员类型 -->
                  <tr>
                    <td>
                      <!-- <span class="red">*</span> -->
                      <span>人员类型</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-select
                        v-model="modifyPersonForm.rylx_bm"
                        style="width: 100%; padding-right: 0"
                      >
                        <a-select-option
                          :value="item.dm"
                          v-for="item in rylxLists"
                          :key="item.dm"
                        >{{ item.mc }}</a-select-option>
                      </a-select>
                    </td>
                    <td>
                      <span class="red">*</span>
                      <span>序号</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <input class="riginalInput" v-model="modifyPersonForm.xh" />
                    </td>
                  </tr>

                  <tr>
                    <td>
                      <span class="red">*</span>
                      <span>登录方式</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-select
                        v-model="modifyPersonForm.dlfs"
                        style="width: 100%; padding-right: 0"
                      >
                        <a-select-option value="账号密码、CA Key">账号密码、CA Key</a-select-option>
                        <a-select-option value="帐号密码">账号密码</a-select-option>
                        <a-select-option value="CA Key">CA Key</a-select-option>
                      </a-select>
                    </td>
                    <td>
                      <span>身份</span>
                      <span class="red">*</span>
                    </td>
                    <td style="width: 100%; padding-right: 0">
                      <a-tree-select
                        v-model="modifyPersonForm.jcrysf_dm"
                        treeNodeFilterProp="title"
                        show-search
                        style="width: 100%"
                        :dropdown-style="{ maxHeight: '300px', overflow: 'auto' }"
                        allow-clear
                      >
                        <a-tree-select-node
                          v-for="item in shengFenml"
                          :key="item.dm"
                          :title="item.mc"
                          :value="item.dm"
                        >
                          <a-tree-select-node
                            v-for="el in item.children"
                            :key="el.dm"
                            :title="el.mc"
                            :value="el.dm"
                          >
                            <a-tree-select-node
                              v-for="ele in el.children"
                              :key="ele.dm"
                              :title="ele.mc"
                              :value="ele.dm"
                            >
                              <a-tree-select-node
                                v-for="ele1 in ele.children"
                                :key="ele1.dm"
                                :title="ele1.mc"
                                :value="ele1.dm"
                              ></a-tree-select-node>
                            </a-tree-select-node>
                          </a-tree-select-node>
                        </a-tree-select-node>
                      </a-tree-select>
                    </td>
                  </tr>
                </table>
              </div>
            </a-tab-pane>
            <a-tab-pane key="2" tab="角色信息"></a-tab-pane>
          </a-tabs>
          <div style="padding: 16px">
            <RoleInfo ref="roles" v-show="modifyActiveKey == '2'" :record="record" />
          </div>
        </div>
      </a-modal>

      <!-- 同步部门数据 -->
      <a-modal
        v-model="tbbmsjDia"
        title="同步部门数据"
        @ok="tbbmsjDiaSureBtn"
        class="zzjg-dialog addPerson"
        centered
      >
        <a-checkbox-group v-model="checkedList" :options="plainOptions" />
      </a-modal>

      <!-- 重置密码 -->
      <a-modal
        v-model="resetDia"
        title="重置密码"
        @ok="resetDiaBtn()"
        class="addPerson cz"
        centered
        @cancel="czcancel"
      >
        <div style="margin-bottom: 15px">
          <span style="margin-right: 8px; width: 60px; display: inline-block">新密码:</span>
          <el-input style="width: 85%" v-model="ruleForm.pass" type="password" show-password />
        </div>
        <div>
          <span style="margin-right: 8px; width: 60px; display: inline-block">确认密码:</span>
          <el-input style="width: 85%" v-model="ruleForm.checkPass" type="password" show-password />
        </div>
      </a-modal>
    </div>
  </div>
</template>

<script>
import sm3Text from './components/sm3'
const plainOptions = [
  '同步部门信息',
  '同步角色信息',
  '同步人员信息',
  '同步人员角色分配信息'
]
// table表头
const personMessegeColumns = [
  {
    title: '姓名',
    dataIndex: 'mc',
    width: '7%',
    ellipsis: true
  },
  {
    title: '登录名',
    dataIndex: 'dlbm',
    ellipsis: true,
    width: '7%'
  },
  {
    title: '手机号码',
    dataIndex: 'dhhm',
    ellipsis: true
  },
  {
    title: '电子邮件',
    dataIndex: 'dzyj',
    width: '11%',
    ellipsis: true
  },
  {
    title: '登录方式',
    dataIndex: 'dlfs',
    ellipsis: true
  },
  {
    title: '在职状态',
    dataIndex: 'zzzt',
    ellipsis: true,
    width: '7%'
  },
  {
    title: '操作',
    // dataIndex: "action",
    scopedSlots: { customRender: 'action' },
    width: '33%'
  }
]
// 隐藏操作表格框
const personMessegeColumns2 = [
  {
    title: '姓名',
    dataIndex: 'mc',
    width: '7%',
    ellipsis: true
  },
  {
    title: '登录名',
    dataIndex: 'dlbm',
    width: '7%',
    ellipsis: true
  },
  {
    title: '手机号码',
    dataIndex: 'dhhm',
    ellipsis: true
  },
  {
    title: '电子邮件',
    dataIndex: 'dzyj',
    width: '11%',
    ellipsis: true
  },
  {
    title: '登录方式',
    dataIndex: 'dlfs',
    ellipsis: true
  },
  {
    title: '在职状态',
    dataIndex: 'zzzt',
    ellipsis: true,
    width: '7%'
  }
]
// table表头(隐藏角色)
const personMessegeColumns1 = [
  {
    title: '姓名',
    dataIndex: 'mc',
    width: '7%',
    ellipsis: true
  },
  {
    title: '登录名',
    dataIndex: 'dlbm',
    ellipsis: true,
    width: '7%'
  },
  {
    title: '角色名称',
    dataIndex: 'jsmc',
    ellipsis: true
  },
  {
    title: '手机号码',
    dataIndex: 'dhhm',
    ellipsis: true
  },
  {
    title: '电子邮件',
    dataIndex: 'dzyj',
    width: '11%',
    ellipsis: true
  },
  {
    title: '登录方式',
    dataIndex: 'dlfs',
    ellipsis: true
  },
  {
    title: '在职状态',
    dataIndex: 'zzzt',
    ellipsis: true,
    width: '7%'
  },
  {
    title: '操作',
    // dataIndex: "action",
    scopedSlots: { customRender: 'action' },
    width: '33%'
  }
]
// 回收站列表
const huishouzhanColumns = [
  {
    title: '单位名称',
    dataIndex: 'dwmc',
    width: '20%',
    ellipsis: true
  },
  {
    title: '部门名称',
    dataIndex: 'bmmc',
    ellipsis: true
  },
  {
    title: '部门简称',
    dataIndex: 'm'
  },
  {
    title: '父部门',
    dataIndex: 'fbmbm'
  },
  {
    title: '文号简称',
    dataIndex: 'bmwhjc'
  },
  {
    title: '案号简称',
    dataIndex: 'bmahjc'
  }
]

const huishouzhanRyColumns = [
  {
    title: '单位',
    dataIndex: 'zzdwmc'
  },
  {
    title: '名称',
    dataIndex: 'mc'
  },
  {
    title: '工作证号',
    dataIndex: 'gzzh'
  },
  {
    title: '电话',
    dataIndex: 'dhhm'
  },
  {
    title: '电子邮箱',
    dataIndex: 'dzyj'
  },
  {
    title: '是否临时人员',
    dataIndex: 'sflsry'
  },
  {
    title: '是否停职',
    dataIndex: 'zzzt'
  }
]

import vuex from 'vuex'
import TreeSelect from './components/systemTreeSelect.vue'
const logininfo = vuex.createNamespacedHelpers('login')
const yhqxinfo = vuex.createNamespacedHelpers('yhqx')
const role = vuex.createNamespacedHelpers('zzjg')
import RoleInfo from './components/roleInfo'
import InputDiy from './components/input'
import service from './api/api'
export default {
  data() {
    return {
      dwList: [],
      defaultProps: {
        children: 'children',
        label: 'dwmc'
      },
      dwbm: '',

      shengFenml: [], //身份
      record: {},
      modifyDialog: false,
      nodeMessege: '', //节点信息
      tableSearch: '',
      bmSelectList: [],
      replaceFields: {
        children: 'children',
        title: 'mc',
        key: 'id'
      },
      addChildFormFbmbm: '',
      zzjgml: [], //组织结构目录
      temporaryValue: [], //临时组织结构目录
      selectTreeNode: [], //默认选中节点
      personMessegeColumns,
      personMessegeColumns1,
      personMessegeColumns2,
      personMessegeData: [],
      selectedTable: [],
      selectedTable2: [],
      recycleSelectedTable: [],
      recycleSelectedTableBm: [],
      showDepartment: false,
      showBmRole: false,
      showSetLoginMode: false,
      showPerson: false,
      showChildDeparment: false,
      showCopyRole: false,
      // 分页
      pagination: {
        pageSize: 12, // 一页的数据限制
        current: 1, // 当前页
        total: 0, // 总数
        hideOnSinglePage: false, // 只有一页时是否隐藏分页器
        showQuickJumper: true, // 是否可以快速跳转至某页
        showSizeChanger: true, // 是否可以改变 pageSize
        pageSizeOptions: ['12', '24', '36'], // 指定每页可以显示多少条
        onShowSizeChange: (current, pagesize) => {
          // 改变 pageSize时的回调
          this.pagination.current = current
          this.pagination.pageSize = pagesize
          this.getTable()
        },
        onChange: current => {
          // 切换分页时的回调，
          this.pagination.current = current
          this.getTable()
        },
        // 可以展示总数
        showTotal: total => `总共：${total}条`
      },
      addDiaKeyWorld: '',
      //添加人员对话框单独分页
      pagination2: {
        pageSize: 10, // 一页的数据限制
        current: 1, // 当前页
        total: 0, // 总数
        hideOnSinglePage: false, // 只有一页时是否隐藏分页器
        showQuickJumper: true, // 是否可以快速跳转至某页
        showSizeChanger: true, // 是否可以改变 pageSize
        pageSizeOptions: ['5', '10'], // 指定每页可以显示多少条
        onShowSizeChange: (current, pagesize) => {
          // 改变 pageSize时的回调
          this.pagination2.current = current
          this.pagination2.pageSize = pagesize
          this.queryTableDiaApi()
        },
        onChange: current => {
          // 切换分页时的回调，
          this.pagination2.current = current
          this.queryTableDiaApi()
        },
        // 可以展示总数
        showTotal: total => `总共：${total}条`
      },
      searchTableParams: {
        filter: {
          dwbm: '', //
          keyWorld: ''
        },
        orderBy: ''
      },
      modifyPersonForm: {
        bmbm: '',
        bmmc: '',
        dhhm: '',
        dlbm: '',
        dlfs: '',
        dzyj: '',
        jsbm: '',
        jsmc: '',
        mc: '',
        rybm: '',
        rylx_bm: '',
        rylx_mc: '',
        zzzt: '',
        sfzh: '',
        zzdwbm: '',
        jcrysf_dm: ''
      },
      showDrawerFlag: false,
      recycleVisible: false, //气泡框
      // 添加部门
      addForm: {
        bmmc: '',
        bmjc: '',
        bmwhjc: '',
        bmahjc: '',
        bmxh: '',
        fbmbm: '',
        sflsbm: '',
        bmlbList: [],
        bmlb: '',
        bz: '',
        sflsbm: ''
      },
      // 设置登录方式
      setLoginForm: {
        range: '', //范围
        region: '' //方式
      },
      level: '1',
      //添加角色
      bmRoleForm: {
        jsmc: '',
        spjbbm: '',
        zjldbm: '',
        mrzjldmc: ''
      },
      //添加子部门
      addChildForm: {
        bmmc: '',
        bmlbList: []
      },
      addPersonForm: {
        dlbm: '',
        mc: '',
        xh: '',
        sflsry: 'N',
        dhhm: '',
        sfzh: '',
        rylx_mc: '',
        rylx_bm: '',
        jcrysf_dm: '',
        jcrysf_mc: ''
      },
      value: '',
      // end
      addTableData: [],
      checkFlag: false,
      // 回收站
      huishouzhanLists: [],
      huishouzhanRyLists: [],
      temporaryHuishouzhanLists: [],
      huishouzhanColumns,
      huishouzhanRyColumns,
      huishouzhanBmglParams: {
        filter: {
          bmjc: '',
          bmmc: '',
          dwbm: '' //
        },
        orderBy: ''
      },
      huishouzhanRyParams: {
        filter: {
          gzzh: '',
          mc: '',
          zzdwbm: '' //
        },
        orderBy: ''
      },
      bmmc: '',
      bmjc: '',
      gzzh: '',
      mc: '',
      cjrybm: '',
      cjrymc: '',
      defaultExpandedKeys: [], //默认展开
      treeExpandedKeys: [],
      bmTitle: '添加部门',
      dwInfoMesseage: '',
      bmInfoMesseage: '',
      roleInfoMesseage: '',
      tabTitle: '单位信息',
      personalInformation: {},
      copyRoleLists: [],
      copyRoleLists1: [],
      showChangeRole: false,
      changeRoleForm: {
        jsmc: '',
        spjbbm: ''
      },
      tbbmsjDia: false,
      plainOptions,
      checkedList: [],
      spxsmcSelects: [],
      bmlbListsApi: [],
      loading: false,
      spxsmcLists: [],
      rylxLists: [],
      mrzjldTest: [],
      mrzjldml: [],
      searchTreeValue: '',
      modifyActiveKey: '1',
      selectedRowKeys: [],
      rYSelectedRowKeys: [],
      bmSelectedRowKeys: [],
      resetDia: false,
      ruleForm: {
        pass: '',
        checkPass: ''
      },
      resetVal: ''
    }
  },

  created() {
    this.getDwbm()
  },
  mounted() {
    // this.huishouzhanBmglParams.filter.dwbm = this.personInfo.dwbm;
    // this.huishouzhanRyParams.filter.zzdwbm = this.personInfo.dwbm;
    // this.defaultExpandedKeys = [this.personInfo.dwbm];
    // // 父部门得下拉列表
    // this.getBmSelectLists();
    // this.cjrybm = this.personInfo.rybm;
    // this.cjrymc = this.personInfo.mc;
    // this.getTreeList2();
    // this.getTreeList();
    // this.getRecycleBm();
    // this.getRecycleRy();
    // this.getRylxLists();
    // this.getShengFenLists();
    // this.mrzjldTreeList();
  },
  methods: {
    async getDwbm() {
      let res = await service.zzjg.getDwbm({ dwbm: this.personInfo.dwbm })
      this.dwList = res.data
      // this.dwList = this.getTreeData(res.data, "dwbm", "fdwbm");
      this.dwbm = this.dwList[0].dwbm
      this.changeTree()
    },
    changeTree(selectValue, checkedData) {
      this.huishouzhanBmglParams.filter.dwbm = this.personInfo.dwbm
      this.huishouzhanRyParams.filter.zzdwbm = this.personInfo.dwbm
      this.defaultExpandedKeys = [this.personInfo.dwbm]

      // 父部门得下拉列表
      this.getBmSelectLists()
      this.cjrybm = this.personInfo.rybm
      this.cjrymc = this.personInfo.mc
      this.getTreeList2()

      this.getTreeList()
      this.getRecycleBm()
      this.getRecycleRy()
      this.getRylxLists()
      this.getShengFenLists()
      this.mrzjldTreeList()
    },
    /**转树结构 */
    getTreeData(arr, id, pid) {
      const newArr = []
      const obj = {}
      for (const item of arr) {
        obj[item[id]] = item
      }
      for (const item of arr) {
        const pItem = obj[item[pid]]
        if (pItem) {
          if (!pItem.children) {
            pItem.children = []
          }
          pItem.children.push(item)
        } else {
          newArr.push(item)
        }
      }

      return newArr
    },

    ...role.mapMutations(['CHANGEROLEINFO']),
    changeDiaClose() {
      this.CHANGEROLEINFO([])
    },
    reset(item) {
      this.resetDia = true
      this.resetVal = item
    },
    czcancel() {
      this.resetDia = false
      this.resetVal = ''
      this.ruleForm = {}
    },
    resetDiaBtn() {
      // debugger
      if (this.ruleForm.pass !== '' && this.ruleForm.checkPass !== '') {
        if (this.ruleForm.pass === this.ruleForm.checkPass) {
          service.zzjg
            .chongzhimima({
              kl: this.ruleForm.pass ? sm3Text(this.ruleForm.pass) : '',
              rybm: this.resetVal.rybm,
              zzdwbm: this.resetVal.zzdwbm
            })
            .then(res => {
              if (res.code == '200') {
                this.czcancel()
                this.$message.success('操作成功')
              }
            })
        } else {
          this.$message.warning('两次输入密码不一致，请保持一致')
        }
      } else {
        this.$message.warning('密码不能为空')
      }
    },
    clickPopover() {
      this.rYSelectedRowKeys = []
      this.bmSelectedRowKeys = []
    },
    // 回收站部门选中
    bmOnSelectChange(selectedRowKeys, selectedTable) {
      this.bmSelectedRowKeys = selectedRowKeys
      this.recycleSelectedTableBm = selectedTable
    },
    // 回收站人员选中
    rYOnSelectChange(selectedRowKeys, selectedTable) {
      this.rYSelectedRowKeys = selectedRowKeys
      this.recycleSelectedTable = selectedTable
    },
    // table表格选中
    onSelectChange(selectedRowKeys, selectedTable) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedTable = selectedTable
    },
    ...yhqxinfo.mapMutations(['CHANGENODEMESSEGE']),
    async getRylxLists() {
      let res = await service.bydm.queryTable({ lbbm: '9902' })
      if (res.code == 0) {
        this.rylxLists = res.data
      }
    },
    // 展开树节点
    expand(expandedKeys) {
      this.defaultExpandedKeys = expandedKeys
    },
    // 身份
    async getShengFenLists() {
      let res = await service.bydm.queryTable({ lbbm: '9979' })
      if (res.code == 0) {
        this.shengFenml = res.data
      }
    },
    bmClickAddZbm() {
      this.showChildDeparment = true
      this.addChildFormFbmbm = this.nodeMessege.mc
      this.sendBmlbListsApi()
    },
    // 单位下点击添加部门
    dwClickAddBm() {
      this.addForm = {
        bmmc: '',
        bmjc: '',
        bmwhjc: '',
        bmahjc: '',
        bmxh: '',
        fbmbm: '',
        sflsbm: '',
        bmlbList: [],
        bz: '',
        sflsbm: ''
      }
      this.findMaxXhByDwbm()
      // 父部门得下拉列表
      this.getBmSelectLists()
      this.sendBmlbListsApi()
      this.bmTitle = '添加部门'
      this.showDepartment = true
    },
    sendBmlbListsApi() {
      service.zzjg.queryBmLbFldm().then(res => {
        if (res.code == 0) {
          this.bmlbListsApi = res.data
        }
      })
    },
    // 添加部门获取最大序号
    findMaxXhByDwbm() {
      service.zzjg.findMaxXhByDwbm({ dwbm: this.dwbm }).then(res => {
        if (res.code == 0) {
          this.addForm.bmxh = res.data.bmxh
        }
      })
    },
    toGoYhsq() {
      this.CHANGENODEMESSEGE(this.nodeMessege)
      this.$router.push({
        path: '/swxyhqx',
        query: {
          id: this.nodeMessege.id
        }
      })
    },
    addDia() {
      this.showDrawer()
    },
    // 单独的table查询
    onSearch2() {
      this.queryTableDiaApi()
    },
    async queryTableDiaApi() {
      let data = {
        filter: {
          ...this.nodeMessege.params,
          keyWorld: this.addDiaKeyWorld
        },
        pageNum: this.pagination2.current,
        pageSize: this.pagination2.pageSize
      }
      const res = await service.zzjg.queryRyList(data)
      if (res.code == 0) {
        this.addTableData = res.data.list
        this.pagination2.total = res.data.total
      }
    },
    // 添加角色弹框
    addRoleDia(text) {
      let data = {
        bmbm: this.nodeMessege.params.bmbm,
        bz: '',
        cjrbm: this.personInfo.rybm,
        cjrmc: this.personInfo.mc,
        dwbm: this.dwbm,
        jsbm: this.nodeMessege.params.jsbm,
        ryList: [{ mc: text.mc, rybm: text.rybm, ryxh: text.xh }]
      }
      service.zzjg.addryjsfp(data).then(res => {
        if (res.code == 0) {
          this.$message.success('添加成功')
          this.showPerson = false
          this.getTreeList()
        }
      })
    },
    // 批量添加角色
    plAddRole() {
      if (this.nodeMessege.level != 3) {
        this.$message.warning('请选择角色节点')
        return
      }
      if (this.selectedTable2.length < 1) {
        this.$message.warning('请选择人员')
        return
      }
      let data = {
        bmbm: this.nodeMessege.params.bmbm,
        bz: '',
        cjrbm: this.personInfo.rybm,
        cjrmc: this.personInfo.mc,
        dwbm: this.dwbm,
        jsbm: this.nodeMessege.params.jsbm,
        ryList: this.selectedTable2.map(item => {
          return { mc: item.mc, rybm: item.rybm, ryxh: item.xh }
        })
      }
      service.zzjg.addryjsfp(data).then(res => {
        if (res.code == 0) {
          this.$message.success('添加成功')
          this.showPerson = false
          this.getTreeList()
        }
      })
    },
    closeAddRy() {
      // this.selectedTable2 = [];
    },
    // 修改部门信息
    changeBmInfo() {
      this.getBmSelectLists()
      this.sendBmlbListsApi()
      this.addForm = { ...this.bmInfoMesseage }
      this.bmTitle = '修改部门信息'
      this.showDepartment = true
    },

    // 修改人员
    onEdit(record) {
      this.modifyActiveKey = '1'
      this.record = { ...record }
      this.modifyPersonForm = { ...record }
      this.modifyDialog = true
    },
    // 解锁
    jieShuo(item) {
      service.zzjg
        .jieShuoApi({ rybm: item.rybm, zzdwbm: item.zzdwbm })
        .then(res => {
          if (res.data) {
            this.$message.success('解锁成功')
            this.getTable()
          }
        })
    },
    jieShuo2() {
      service.zzjg
        .jieShuoApi({
          rybm: this.nodeMessege.params.rybm,
          zzdwbm: this.nodeMessege.params.zzdwbm
        })
        .then(res => {
          if (res.data) {
            this.$message.success('解锁成功')
            this.getPersonInfo()
          }
        })
    },
    // 修改确定按钮
    modifySureBtn() {
      const _this = this
      if (
        !(
          this.modifyPersonForm.dlbm &&
          this.modifyPersonForm.mc &&
          this.modifyPersonForm.sfzh &&
          this.modifyPersonForm.dhhm &&
          this.modifyPersonForm.xh != undefined &&
          this.modifyPersonForm.dlfs &&
          this.modifyPersonForm.jcrysf_dm
        )
      ) {
        this.$message.error('请完善必填项信息')
        return
      }

      // 判断是否选择角色 如果没选择角色,
      if (this.roleInfoMsg.length == 0) {
        this.$confirm('当前人员未设置角色, 是否继续保存?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            this.changePersonApi()
          })
          .catch(() => { })
      } else {
        // 选择了角色,审批级别就必须填
        if (_this.roleInfoMsg.length > 0) {
          for (let el of _this.roleInfoMsg) {
            if (!el.spjbbm) {
              _this.$message.warning('请设置审批级别')
              return
            }
          }
        }
        this.changePersonApi()
      }
    },
    // 修改人员 api
    changePersonApi() {
      this.loading = true
      let rylx_mcArr = this.rylxLists.filter(
        item => this.addPersonForm.rylx_bm == item.dm
      )

      let arr = this.rylxLists.filter(
        val => val.dm == this.modifyPersonForm.rylx_bm
      )

      let data = {
        ...this.modifyPersonForm,
        zhxgrbm: this.personInfo.rybm,
        jsList:
          (this.roleInfoMsg &&
            this.roleInfoMsg.map(item => {
              return {
                bmbm: item.params.bmbm,
                dwbm: item.params.dwbm,
                jsbm: item.params.jsbm,
                spjbbm: item.spjbbm,
                zjldbm: item.zjldbm
              }
            })) ||
          [],
        rylx_mc: rylx_mcArr.length > 0 && rylx_mcArr[0].mc
      }

      data.rylx_mc = arr[0].mc

      service.zzjg.updateRybm(data).then(res => {
        if (res.code == 0) {
          this.$message.success('修改成功')
          this.CHANGEROLEINFO([])
          this.getTable()
          this.modifyDialog = false
          this.getTreeList()
        }
      })
    },
    // 点击的是第几级
    treeSelect(selectedKeys, node) {
      if (selectedKeys.length > 0) {
        this.selectTreeNode = selectedKeys
        let data = node.node.dataRef
        this.level = data.level
        this.nodeMessege = data
        this.searchTableParams.filter = data.params
        if (this.level != 4) {
          this.getTable()
        }
        this.getTableInfo()
      }

      switch (this.level) {
        case '1':
          this.tabTitle = '单位信息'
          break
        case '2':
          this.tabTitle = '部门信息'
          break
        case '3':
          this.tabTitle = '角色信息'
          break
      }
    },
    // top
    getTableInfo() {
      let data = null
      switch (this.level) {
        case '1':
          this.getDwInfo()
          break
        case '2':
          data = {
            ...this.nodeMessege.params
          }
          service.zzjg.getBmInfo(data).then(res => {
            this.bmInfoMesseage = res.data
          })
          break
        case '3':
          data = {
            ...this.nodeMessege.params
          }
          service.zzjg.getRoleInfo(data).then(res => {
            this.roleInfoMesseage = res.data
          })
          break
        case '4':
          data = {
            ...this.nodeMessege.params
          }
          service.zzjg.getGrInfo(data).then(res => {
            this.personalInformation = res.data
          })
          break
        default:
          this.getDwInfo()
          break
      }
    },
    // top
    getDwInfo() {
      let data = {
        ...this.nodeMessege.params
      }
      if (data.dwbm) {
        service.zzjg.getDwInfo(data).then(res => {
          this.dwInfoMesseage = res.data
        })
      }
    },
    // 抽屉
    showDrawer() {
      this.record = { ...this.nodeMessege }
      this.CHANGEROLEINFO([])
      //调序号的接口
      service.zzjg.findMaxXhRybm({ zzdwbm: this.dwbm }).then(res => {
        if (res.code == 0) {
          this.showDrawerFlag = true
          this.addPersonForm.xh = res.data.xh
        }
      })
    },
    setLoginOpen() {
      if (this.level > 0) {
        this.showSetLoginMode = true
        this.setLoginForm.range = '2'
      } else {
        this.$message.warning('请选择树节点!!!')
      }
    },
    // 关闭抽屉
    onClose() {
      this.addPersonForm = {
        dlbm: '',
        mc: '',
        sfzh: '',
        dhhm: '',
        zzdwbm: this.dwbm,
        zzdwmc: this.personInfo.dwmc
      }
      this.CHANGEROLEINFO([])
      this.showDrawerFlag = false
    },
    // 部门
    onSearchBm() {
      this.huishouzhanBmglParams.filter.bmmc = this.bmmc
      this.huishouzhanBmglParams.filter.bmjc = this.bmjc
      this.getRecycleBm()
    },
    onSearchRy() {
      this.huishouzhanRyParams.filter.gzzh = this.gzzh
      this.huishouzhanRyParams.filter.mc = this.mc
      this.getRecycleRy()
    },
    // 同步部门数据确定按钮
    tbbmsjDiaSureBtn() {
      this.tbbmsjBtn()
    },
    // 同步部门数据
    async tbbmsjBtn() {
      this.loading = true
      const res = await service.zzjg.tbbmsj({
        dwbm: this.dwbm,
        cjrbm: this.personInfo.rybm,
        cjrmc: this.personInfo.mc,
        dwmc: this.personInfo.dwmc,
        list: this.checkedList
      })
      if (res.code == 0) {
        this.$message.success('操作成功')
        this.tbbmsjDia = false
        this.loading = false
        this.getTreeList()
        this.checkedList = []
      }
    },
    //添加部门 修改部门
    async addDepartmentBtn() {
      if (this.addForm.bmmc.length <= 0) {
        this.$message.error('请完善信息')
        return
      }
      if (this.addForm.bmxh === '') {
        this.$message.error('请完善信息')
        return
      }
      let res = null,
        data = null
      this.loading = true
      switch (this.bmTitle) {
        case '添加部门':
          data = {
            dwbm: this.dwbm,
            ...this.addForm
          }
          res = await service.zzjg.addBm(data)
          if (res.code == 0) {
            this.$message.success('添加成功')
            this.getTreeList()
            this.showDepartment = false
          }
          if (res.code == 500) {
            this.$message.warning('部门名重复')
          }
          break
        case '修改部门信息':
          data = {
            dwbm: this.dwbm,
            ...this.addForm
          }
          res = await service.zzjg.changeBm(data)
          if (res.code == 0) {
            this.$message.success('修改成功')
            this.getTreeList()
            this.getTableInfo()
            this.getBmSelectLists()
            this.showDepartment = false
            this.loading = false
          }
          if (res.code == 500) {
            this.$message.warning('部门名重复')
          }
          break
      }
    },
    // 删除部门
    deletDepartmentBtn() {
      if (this.nodeMessege.children.length > 0) {
        this.$message.warning('部门下有角色不能删除')
        return
      }
      this.$confirm('此操作将永久删除该部门, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          let data = {
            ...this.nodeMessege.params
          }
          const res = await service.zzjg.deletBm(data)
          if (res.code == 0) {
            this.getTreeList()
            this.getRecycleBm()
            this.$message.success('删除成功')
          }
          if (res.code == 500) {
            this.$message.warning('操作错误,' + res.data.message)
          }
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },

    // 获取部门下拉列表
    async getBmSelectLists() {
      let data = {
        dwbm: this.dwbm
      }
      let res = await service.zzjg.getBmSelect(data)
      if (res.code == 0) {
        this.bmSelectList = res.data
        console.log(this.bmSelectList)
      }
    },

    //删除放入回收站
    async deleteIntoRecycleBtn() {
      if (this.selectedTable.length > 0) {
        this.$confirm('此操作将删除这些人员放入回收站, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            let data = {
              ryList: this.selectedTable.map(item => item.rybm),
              zzdwbm: this.dwbm
            }
            const res = await service.zzjg.deleteIntoRecycle(data)
            res.code == 0 && this.$message.success('删除成功')
            this.getTable()
            this.getRecycleBm()
            this.getRecycleRy()
            // let data = {
            //   ...this.nodeMessege.params
            // }
            // const res = await service.zzjg.deletBm(data)
            // if (res.code == 0) {
            //   this.getTreeList()
            //   this.getRecycleBm()
            //   this.$message.success('删除成功')
            // }
            // if (res.code == 500) {
            //   this.$message.warning('操作错误,' + res.data.message)
            // }
          })
          .catch(() => {
            // this.$message({
            //   type: 'info',
            //   message: '已取消删除'
            // })
          })
      } else {
        this.$message.warning('请选择需要删除的人员')
      }
    },
    // 回收站恢复人员
    async recycleHuifuRy() {
      if (this.rYSelectedRowKeys.length > 0) {
        let ryList = this.recycleSelectedTable.map(item => item.rybm)
        let params = {
          ryList,
          zzdwbm: this.dwbm
        }
        let res = await service.zzjg.resumeByRecycle(params)
        if (res.code == 0) {
          this.getRecycleRy()
          //
          this.getTable()
          this.rYSelectedRowKeys = []
          this.$message.success('恢复成功')
        }
      } else {
        this.$message.warning('请选择需要恢复的人员')
      }
    },
    // 回收站恢复部门
    async recycleHuifuBm() {
      if (this.bmSelectedRowKeys.length > 0) {
        let params = {
          bmList: this.recycleSelectedTableBm
        }
        let res = await service.zzjg.resumeByRecycleBm(params)
        if (res.code == 0) {
          this.getRecycleBm()
          this.getTreeList()
          this.bmSelectedRowKeys = []
          this.$message.success('恢复成功')
        }
      } else {
        this.$message.warning('请选择需要恢复的部门')
      }
    },
    // 永久删除部门
    yjscBmBtn() {
      if (this.bmSelectedRowKeys.length > 0) {
        this.$confirm('此操作将永久删除该部门, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            let params = {
              bmList: this.recycleSelectedTableBm
            }
            let res = await service.zzjg.yjscBm(params)
            if (res.code == 0) {
              this.getRecycleBm()
              this.$message.success('删除成功')
              this.rYSelectedRowKeys = []
              this.bmSelectedRowKeys = []
            }
          })
          .catch(() => {
            // this.recycleVisible = true;
          })
      } else {
        this.$message.warning('请选择需要永久删除的部门')
      }
    },

    // 回收站删除
    recycleShanChuBtn() {
      if (this.rYSelectedRowKeys.length > 0) {
        this.$confirm('此操作将永久删除该人员, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            let ryList = this.recycleSelectedTable.map(item => item.rybm)
            let params = {
              ryList,
              zzdwbm: this.dwbm
            }
            let res = await service.zzjg.deletRyRecycle(params)
            if (res.code == 0) {
              this.getRecycleRy()
              this.rYSelectedRowKeys = []
              this.bmSelectedRowKeys = []
              this.$message.success('删除成功')
            }
          })
          .catch(() => {
            // this.recycleVisible = true;
          })
      } else {
        this.$message.warning('请选择需要永久删除的人员')
      }
    },
    filterTree(e) {
      if (e == '') {
        return
      }
      // debugger;
      this.searchTreeValue = e
      // 临时保存一个值
      const value = e.target.value
      if (value) {
        const tree = JSON.parse(JSON.stringify(this.temporaryValue))
        this.zzjgml = this.filter(tree, value)
        // 展开所有的节点
        const arr = []
        const diGuiExpandedKeys = m => {
          for (let item of m) {
            arr.push(item.id)
            if (item.children && item.children.length > 0) {
              diGuiExpandedKeys(item.children)
            }
          }
        }
        diGuiExpandedKeys(this.zzjgml)
        this.defaultExpandedKeys = arr
      } else {
        this.defaultExpandedKeys = [this.temporaryValue[0].id]
        this.zzjgml = this.temporaryValue
      }
    },
    filterTree1(e) {
      // 临时保存一个值
      const value = e.target.value
      if (value) {
        const tree = JSON.parse(JSON.stringify(this.copyRoleLists))
        this.copyRoleLists = this.filter(tree, value)
      } else {
        this.copyRoleLists = this.copyRoleLists1
      }
    },
    // nodes就是树形的最原始数据，query就是关键字，最后会返回满足条件的节点数组
    filter(nodes, query) {
      // 条件就是节点的title过滤关键字
      let predicate = function (node) {
        if (node.mc && node.mc.indexOf(query) > -1) {
          return true
        } else {
          return false
        }
      }
      if (!(nodes && nodes.length)) {
        return []
      }
      let newChildren = []
      for (let node of nodes) {
        // 以下两个条件任何一个成立，当前节点都应该加入到新子节点集中
        // 1. 子孙节点中存在符合条件的，即 subs 数组中有值
        // 2. 自己本身符合条件
        let subs = this.filter(node.children, query)
        if (predicate(node)) {
          newChildren.push(node)
        } else if (subs && subs.length) {
          node.children = subs
          newChildren.push(node)
        }

        // 以下只需要考虑自身的节点满足条件即可,不用带上父节点
        // if (predicate(node)) {
        //     newChildren.push(node);
        //     node.children = this.filter(node.children, query);
        // } else {
        //     newChildren.push(...this.filter(node.children, query));
        // }
      }
      return newChildren.length ? newChildren : []
    },
    // 添加角色按钮
    addBmRoleBtn() {
      if (!this.bmRoleForm.jsmc) {
        this.$message.error('请完善信息')
        return
      }
      const diGui = (m, val) => {
        for (let item of m) {
          if (item.id == val) {
            this.bmRoleForm.mrzjldmc = item.mc
            break
          } else if (item.children && item.children.length > 0) {
            diGui(item.children, val)
          }
        }
      }
      diGui(this.zzjgml, this.bmRoleForm.zjldbm)
      service.zzjg
        .addRoleApi({
          ...this.bmRoleForm,
          cjrbm: this.personInfo.rybm,
          cjrmc: this.personInfo.mc,
          dwmc: this.personInfo.dwmc
        })
        .then(res => {
          if (res.code == 0) {
            this.getTreeList()
            this.showBmRole = false
            this.$message.success('操作成功')
          }
        })
    },
    // 添加角色
    addRole() {
      this.getSpxsmcLists()
      this.mrzjldTreeList(this.nodeMessege.id)
      this.bmRoleForm = {
        ...this.bmInfoMesseage,
        jsmc: '',
        mrzjldmc: '',
        zjldbm: ''
      }
      this.showBmRole = true
    },
    // 审批显示名称
    getSpxsmcLists() {
      service.zzjg.addBtnSpxsmc().then(res => {
        if (res.code == 0) {
          this.spxsmcLists = res.data
        }
      })
    },
    // 修改角色
    changeRole() {
      this.getSpxsmcLists()
      this.changeRoleForm = { ...this.roleInfoMesseage }
      this.showChangeRole = true

      //后端返回的是bm值,需要的id值 导致页面显示不对;
      // if (!this.roleInfoMesseage.zjldbm) {
      //   this.showChangeRole = true;
      // } else {
      //   const diGui = (m, val) => {
      //     for (let item of m) {
      //       if (item.bm == val) {
      //         this.$set(this.changeRoleForm, "zjldbm", item.id);
      //         this.showChangeRole = true;
      //         break;
      //       } else if (item.children && item.children.length > 0) {
      //         diGui(item.children, val);
      //       }
      //     }
      //   };
      //   diGui(this.mrzjldml, this.roleInfoMesseage.zjldbm);
      // }
    },
    // 修改角色确定按钮
    changeRoleInfoBtn() {
      service.zzjg
        .updateRoleApi({
          ...this.changeRoleForm,
          zhxgrbm: this.personInfo.rybm,
          zhxgrmc: this.personInfo.mc
        })
        .then(res => {
          if (res.code == 0) {
            this.$message.success('修改成功')
            this.showChangeRole = false
            this.getTreeList()
          }
        })
    },

    // 删除角色
    deletRole() {
      if (this.nodeMessege.children.length > 0) {
        this.$message.warning(
          '角色下有人员不能删除，请清空该角色下人员才能删除'
        )
        return
      }
      this.$confirm('此操作将永久删除该角色, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          let data = {
            ...this.nodeMessege.params,
            zhxgrbm: this.personInfo.rybm,
            zhxgrmc: this.personInfo.mc
          }
          const res = await service.zzjg.deletRoleApi(data)
          console.log(res)
          if (res.code == 0) {
            this.getTreeList()
            // this.getRecycleBm();
            this.$message.success('删除成功')
          }
          if (res.code == 500) {
            this.$message.warning('操作错误,' + res.data.message)
          }
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    },

    setLoginBtn() {
      if (!this.setLoginForm.range) {
        this.$message.error('请选择设置范围')
        return
      }
      if (!this.setLoginForm.region) {
        this.$message.error('请选择登录方式')
        return
      }
      if (this.setLoginForm.range == '1' && this.selectedTable.length < 1) {
        this.$message.error('请选择人员')
        return
      }
      let data = null
      switch (this.setLoginForm.range) {
        case '1':
          let ryList = this.selectedTable.map(item => item.rybm)
          data = {
            dwbm: this.dwbm,
            // dwbm: this.nodeMessege.param.dwbm,
            ryList,
            dlfs: this.setLoginForm.region
          }
          service.zzjg.setPersonLoginMode(data).then(res => {
            if (res.code == 0) {
              this.$message.success('操作成功')
              this.showSetLoginMode = false
              this.getTreeList()
            }
          })
          break
        case '2':
          data = {
            ...this.nodeMessege.params,
            dlfs: this.setLoginForm.region
          }
          service.zzjg.setPersonLoginMode(data).then(res => {
            if (res.code == 0) {
              this.$message.success('操作成功')
              this.showSetLoginMode = false
            }
          })
          break
      }
    },
    // 添加子部门
    addChildDepartmentBtn() {
      if (this.addChildForm.bmmc.length <= 0) {
        this.$message.warning('请完善信息')
      }
      let data = {
        dwbm: this.nodeMessege.params.dwbm,
        ...this.addChildForm,
        fbmbm: this.nodeMessege.params.bmbm
      }
      service.zzjg.addBm(data).then(res => {
        if (res.code == 0) {
          this.$message.success('添加子部门成功')
          this.showChildDeparment = false
          this.getTreeList()
        }
        if (res.code == 500) {
          this.$message.error('名字重复')
        }
      })
    },
    copyRoleSelects(selectedKeys) {
      this.copyRoleSelects = selectedKeys.checked
    },
    // 复制角色
    copyRole() {
      let data = {
        bmList: this.copyRoleSelects,
        ...this.nodeMessege.params,
        dwmc: this.personInfo.dwmc,
        cjrbm: this.personInfo.rybm,
        cjrmc: this.personInfo.mc
      }
      service.zzjg.copyRole(data).then(res => {
        if (res.code == 0) {
          this.$message.success('操作成功')
          this.showCopyRole = false
          this.getTreeList()
        }
      })
    },

    // 添加人员确定按钮
    addPersonSubmit() {
      const _this = this
      if (
        !(
          this.addPersonForm.dlbm &&
          this.addPersonForm.mc &&
          this.addPersonForm.sfzh &&
          this.addPersonForm.dhhm &&
          this.addPersonForm.sflsry &&
          this.addPersonForm.dlfs &&
          this.addPersonForm.xh &&
          this.addPersonForm.jcrysf_dm
        )
      ) {
        this.$message.warning('请完善必填项信息')
        return
      }
      // 判断是否选择角色 如果没选择角色,
      if (this.roleInfoMsg.length == 0) {
        this.$confirm('当前人员未设置角色, 是否继续保存?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            this.addPersonApi()
          })
          .catch(() => { })
      } else {
        // 选择了角色,审批级别就必须填
        if (_this.roleInfoMsg.length > 0) {
          for (let el of _this.roleInfoMsg) {
            if (!el.spjbbm) {
              _this.$message.warning('请设置审批级别')
              return
            }
          }
        }
        this.addPersonApi()
      }
    },
    async addPersonApi() {
      let rylx_mcArr = this.rylxLists.filter(
        item => this.addPersonForm.rylx_bm == item.dm
      )
      let data = {
        ...this.addPersonForm,
        zzdwbm: this.dwbm,
        zzdwmc: this.personInfo.dwmc,
        cjrybm: this.cjrybm,
        cjrymc: this.cjrymc,
        ...this.nodeMessege.params,
        jsList:
          (this.roleInfoMsg &&
            this.roleInfoMsg.map(item => {
              return {
                bmbm: item.params.bmbm,
                dwbm: item.params.dwbm,
                jsbm: item.params.jsbm,
                spjbbm: item.spjbbm,
                zjldbm: item.zjldbm
              }
            })) ||
          [],
        rylx_mc: rylx_mcArr.length > 0 && rylx_mcArr[0].mc
      }
      const res = await service.zzjg.addPerson(data)
      if (res.code == 0) {
        this.$message.success('添加成功')
        this.showDrawerFlag = false
        this.showPerson = false
        this.addPersonForm = {
          dlbm: '',
          mc: '',
          xh: '',
          sflsry: 'N',
          dhhm: '',
          sfzh: '',
          rylx_mc: '',
          rylx_bm: '',
          jcrysf_dm: '',
          jcrysf_mc: ''
        }
        this.getTreeList()
      } else if (res.code == 500) {
        this.$message.warning('登录名已存在')
      }
    },
    // 表格查询
    async onSearch() {
      this.searchTableParams.filter.keyWorld = this.tableSearch
      let data = {
        filter: {
          ...this.searchTableParams.filter
        },
        pageNum: this.pagination.current,
        pageSize: this.pagination.pageSize
      }
      const res = await service.zzjg.queryTable(data)
      if (res.code == 0) {
        this.personMessegeData = res.data.list
        this.pagination.total = res.data.total
      }
    },
    // 停职
    stopWork() {
      if (this.selectedTable.length > 0) {
        this.$confirm('此操作将会把人员停职, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        })
          .then(async () => {
            let ryList = this.selectedTable.map(item => item.rybm)
            let params = {
              ryList,
              zzzt: '2',
              zzdwbm: this.selectedTable[0].zzdwbm
            }
            let res = await service.zzjg.stopWork(params)
            if (res.code == 0) {
              this.getTable()
              this.$message.success('停职成功')
            }
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消停职'
            })
          })
      } else {
        this.$message.warning('请选择停职的人员')
      }
    },
    // 恢复
    async recovery(person) {
      let params = {
        ryList: [person.rybm],
        zzzt: '1',
        zzdwbm: person.zzdwbm
      }
      let res = await service.zzjg.stopWork(params)
      if (res.code == 0) {
        this.getTable()
        this.$message.success('复职成功')
      }
    },
    // 清空密码
    async emptyPwd(person) {
      let params = {
        rybm: person.rybm,
        zzdwbm: person.zzdwbm
      }
      let res = await service.zzjg.emptyPwd(params)
      if (res.code == 0) {
        this.getTable()
        this.$message.success('操作成功')
      }
    },
    // 移除角色
    async yiChuRole(text) {
      let params = {
        bmbm: this.nodeMessege.params.bmbm,
        dwbm: this.nodeMessege.params.dwbm,
        jsbm: this.nodeMessege.params.jsbm,
        rybm: text.rybm,
        zhxgrbm: text.rybm
      }
      let res = await service.zzjg.deleteryjsfp(params)
      if (res.code == 0) {
        this.getTable()
        this.getTreeList()
        this.$message.success('移除成功')
      }
    },
    // api请求
    // 查询树
    async getTreeList() {
      this.searchTableParams = {
        filter: {
          dwbm: this.dwbm,
          keyWorld: ''
        },
        orderBy: ''
      }
      const _this = this
      let params = {
        dwbm: this.dwbm
      }
      let res = await service.zzjg.queryByDwbm(params)
      this.nodeMessege = res.data[0]
      if (res.code == 0) {
        this.level = 1
        this.zzjgml = res.data
        this.selectTreeNode = [res.data[0].id]
        this.temporaryValue = res.data
        this.filterTree(_this.searchTreeValue)
        // 用于查询
        this.getTable()
        this.getDwInfo()
      }
    },
    // 默认直接领导
    async mrzjldTreeList(id) {
      let params = {
        dwbm: this.dwbm,
        id: id
      }
      let res = await service.zzjg.queryByDwbm(params)
      if (res.code == 0) {
        this.mrzjldml = res.data
        // console.log(JSON.stringify( this.mrzjldml))
        this.mrzjldTest = [res.data[0].id]
        this.treeExpandedKeys = [res.data[0].id]
      }
    },
    // 查询树2
    async getTreeList2() {
      let res = await service.zzjg.queryZzjgRole({
        dwbm: this.dwbm
      })
      if (res.code == 0) {
        this.copyRoleLists = res.data
        this.copyRoleLists1 = res.data
        this.copyRoleLists[0].disabled = true
      }
    },
    // 查询列表
    async getTable() {
      this.loading = true
      let data = {
        ...this.searchTableParams,
        pageNum: this.pagination.current,
        pageSize: this.pagination.pageSize
      }
      const res = await service.zzjg.queryTable(data)

      if (res.code == 0 || res.code == 500) {
        this.loading = false
        this.selectedRowKeys = []
        this.personMessegeData = res.data.list
        this.pagination.total = res.data.total
      }
    },
    // 获取回收站部门信息
    async getRecycleBm() {
      let res = await service.zzjg.queryBmbmByRecycle(
        this.huishouzhanBmglParams
      )
      if (res.code == 0) {
        this.huishouzhanLists = res.data.list
      }
    },
    // 获取回收站部门人员信息
    async getRecycleRy() {
      let res = await service.zzjg.queryRyglByRecycle(this.huishouzhanRyParams)
      if (res.code == 0) {
        this.huishouzhanRyLists = res.data.list
      }
    },
    // 修改人员按钮
    changePersonBtn() {
      this.modifyActiveKey = '1'
      this.modifyPersonForm = { ...this.personalInformation }
      this.record = { ...this.personalInformation }
      this.modifyDialog = true
    },
    //离职人员按钮
    async tingzhiPersonBtn() {
      let ryList = [this.nodeMessege.params.rybm]
      let params = {
        ryList,
        zzzt: '2',
        zzdwbm: this.nodeMessege.params.zzdwbm
      }
      let res = await service.zzjg.stopWork(params)
      if (res.code == 0) {
        this.getPersonInfo()
        this.$message.success('停职成功')
      }
    },
    //复职人员按钮
    async fuzhiPersonBtn() {
      let params = {
        ryList: [this.nodeMessege.params.rybm],
        zzzt: '1',
        zzdwbm: this.nodeMessege.params.zzdwbm
      }
      let res = await service.zzjg.stopWork(params)
      if (res.code == 0) {
        this.getPersonInfo()
        this.$message.success('复职成功')
      }
    },
    // 查询个人信息
    getPersonInfo() {
      let data = {
        ...this.nodeMessege.params
      }
      service.zzjg.getGrInfo(data).then(res => {
        this.personalInformation = res.data
      })
    },
    // 清空密码
    async qingKongMm() {
      let params = {
        rybm: this.nodeMessege.params.rybm,
        zzdwbm: this.nodeMessege.params.zzdwbm
      }
      let res = await service.zzjg.emptyPwd(params)
      if (res.code == 0) {
        this.$message.success('操作成功')
      }
    },
    //删除放入回收站
    shanChuPeronBtn() {
      this.$confirm('此操作将删除该人员放入回收站, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async () => {
          let data = {
            ryList: [this.nodeMessege.params.rybm],
            zzdwbm: this.nodeMessege.params.zzdwbm
          }
          const res = await service.zzjg.deleteIntoRecycle(data)
          res.code == 0 && this.$message.success('删除成功')
          this.searchTableParams = {
            filter: {
              dwbm: this.dwbm,
              keyWorld: ''
            },
            orderBy: ''
          }
          this.getTreeList()
          this.getRecycleBm()
          this.getRecycleRy()
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          })
        })
    }
  },
  components: {
    RoleInfo,
    InputDiy,
    TreeSelect
  },
  computed: {
    expandKeys() {
      return ['A' + this.personInfo.dwbm]
    },
    ...logininfo.mapState(['personInfo']),
    ...role.mapState(['roleInfoMsg'])
  }
}
</script>

<style lang="less" scoped>
@import "./css/variableLess.less";
.main-container {
  width: 100%;
  min-height: 800px;
  float: left;
  background-color: #eaeeef !important;
  display: flex;
  justify-content: center;
  .box-container {
    width: 1540px;
    margin: 25px 0;
    background-color: #fff;

    .zzjg-left {
      float: left;
      width: 280px;
      height: 100%;
      border: 1px solid #b6cae4;
      background-color: #fff;
    }
    .personalInformation {
      float: right;
      height: 100%;
      width: calc(100% - 296px);
      background-color: #fff;
      border-radius: 5px;
      border: 1px solid @borderColor-h;
      .header {
        height: 40px;
        box-sizing: border-box;
        border-bottom: 1px solid @borderColor-h;
      }
      .mainBody {
        padding: 10px;
      }
    }
    .right {
      float: right;
      height: 100%;
      width: calc(100% - 290px);
      .top {
        height: 220px;
        background-color: #fff;
        border-radius: 5px;
      }
      .bottom {
        margin-top: 10px;
        height: calc(100% - 230px);
        background-color: #fff;
        border-radius: 5px;
      }
    }
  }
}
.ant-tabs-bar {
  margin: 0;
}
.ant-tabs-tabpane {
  padding: 16px;
}
.ant-tabs {
  height: 100%;
}
.ant-tabs-content {
  height: calc(100% - 40px);
}
.tab-box {
  padding: 10px;
}

.zzjg-tab-box {
  height: calc(100% - 40px);
  border: none !important;
  /deep/ .ant-tree {
    height: calc(100% - 40px);
    overflow-x: hidden;
    overflow-y: auto;
  }
  /deep/ .ant-tree li .ant-tree-node-content-wrapper {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    // font-size: 16px;
  }
}

.ant-input:focus {
  box-shadow: none;
}
.collapse-item {
  display: inline-block;
  background: #82a6df;
  padding: 2px 15px;
  font-size: 16px;
  color: #fff;
}

.ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow {
  right: -490px;
  left: 0;
}

.ant-collapse > .ant-collapse-item > .ant-collapse-header {
  padding-left: 20px;
}
.box {
  margin-bottom: 10px;
}
.box:nth-last-child(1) {
  margin-bottom: 0;
}
/deep/.ant-select-dropdown {
  max-width: 268px !important;
  min-width: none !important;
}
.zzjg-dialog {
  /deep/ .ant-modal {
    width: 900px !important;
  }
  .dialogheader {
    height: 35px;
    background-color: #cbe2ff;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    padding-left: 10px;
    color: #0090ff;
  }
  .dialogcontent {
    padding: 10px;
    display: flex;
    .left {
      padding: 10px;
      box-sizing: border-box;
      width: 325px;
      height: 600px;
      border: 1px solid @borderColor-h;
      margin-right: 10px;
    }
    .right {
      width: calc(100% - 335px);
      height: 600px;
    }
  }
  .dialog {
    border: 1px solid @borderColor-h;
  }
}
.zzjg-dialog-mini {
  /deep/ .ant-modal {
    width: 680px !important;
  }
  .dialogheader {
    height: 35px;
    background-color: #cbe2ff;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    padding-left: 10px;
    color: #0090ff;
  }
  .dialogcontent {
    padding: 10px;
    display: flex;
    .left {
      padding: 10px;
      box-sizing: border-box;
      width: calc(50% - 5px);
      height: 600px;
      border: 1px solid @borderColor-h;
      margin-right: 10px;
    }
    .right {
      width: calc(50% - 5px);
      height: 600px;
    }
  }
  .dialog {
    border: 1px solid @borderColor-h;
  }
}
.zzjg-dialog-large {
  /deep/ .ant-modal {
    width: 1150px !important;
  }
  .dialogheader {
    height: 35px;
    background-color: #cbe2ff;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    padding-left: 10px;
    color: #0090ff;
  }
  .dialogcontent {
    padding: 10px;
    display: flex;
    .left {
      padding: 10px;
      box-sizing: border-box;
      width: 225px;
      height: 600px;
      border: 1px solid @borderColor-h;
      margin-right: 10px;
    }
    .right {
      width: calc(100% - 225px);
      height: 600px;
    }
  }
  .dialog {
    border: 1px solid @borderColor-h;
  }
}
// 复制角色
.fzjs {
  /deep/ .ant-modal {
    width: 800px !important;
    .ant-modal-content {
      height: 600px !important;
      .ant-modal-body {
        height: calc(100% - 100px) !important;
        .ant-tree {
          height: calc(100% - 42px);
          overflow: auto;
        }
      }
    }
  }
  .dialogheader {
    height: 35px;
    background-color: #cbe2ff;
    font-size: 16px;
    font-weight: 700;
    line-height: 35px;
    padding-left: 10px;
    color: #0090ff;
  }
  .dialogcontent {
    padding: 10px;
    display: flex;
    .left {
      padding: 10px;
      box-sizing: border-box;
      width: 325px;
      height: 600px;
      border: 1px solid @borderColor-h;
      margin-right: 10px;
    }
    .right {
      width: calc(100% - 335px);
      height: 600px;
    }
  }
  .dialog {
    border: 1px solid @borderColor-h;
  }
}
.zzjgTable {
  width: 100%;
  height: 100%;
  tr,
  th,
  td {
    border: 1px solid @borderColor-h;
    height: 36px;
    text-align: right;
    padding-right: 10px;
    color: #666;
    border-collapse: collapse; //不加上这个会重合边框
  }
}
.zzjg-dialog,
.zzjg-dialog-large .zzjg-dialog-mini .ant-select {
  width: 100%;
}
.addPerson /deep/ .ant-tabs-tabpane {
  padding: 0;
}
/deep/ .ant-drawer-content-wrapper {
  width: 1200px !important;
}
.popover-input {
  padding-left: 10px;
  height: 56px;
  width: 100%;
  line-height: 56px;
  .ant-input {
    width: auto;
  }
}
//
.ant-popover-inner-content .ant-input-affix-wrapper {
  width: auto;
}
// table表格滚动条
/deep/ .ant-tabs .ant-tabs-top-content,
.ant-tabs .ant-tabs-bottom-content {
  height: calc(100% - 56px) !important;
  .ant-tabs-tabpane-active {
    height: 100%;
  }
  .ant-table-wrapper {
    height: 100%;
    .ant-spin-nested-loading {
      height: 100%;
      .ant-spin-container {
        height: 100%;
        .ant-table {
          height: calc(100% - 39px);
          overflow: auto;
        }
      }
    }
  }
}
.ant-popover-inner {
  .ant-tabs.ant-tabs-card .ant-tabs-card-content > .ant-tabs-tabpane-inactive,
  .ant-tabs.ant-tabs-editable-card
    .ant-tabs-card-content
    > .ant-tabs-tabpane-inactive {
    height: 0;
  }
}
/deep/.ant-input-search .ant-btn-primary {
  min-width: 70px;
}
.cz {
  width: 550px !important;
  .ant-modal {
    width: 550px !important;
  }
}
</style>
